<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="../../mytags.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <t:base type="jquery"></t:base>
    <script type="text/javascript" src="webpage/com/wx/added_product/procurement/shoppingCar.js"></script>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>订单详情</title>
    <script type="text/javascript" charset="utf-8">
        mui.init();
        mui.plusReady(function () {
            var _SELF = plus.webview.currentWebview();
        })
    </script>
    <style>
        *{
            font-size:14px !important;
        }
        .inr{
            margin-left : 0px !important;
        }
        .inr span {
            line-height: 40px;
        }

        .mui-input-clear {
            margin-bottom: 0px !important;
        }

        #invoiceCardDiv input{
            width:70%;
            height:30px;
            border:none;
        }
        #invoiceCardDiv h4{
            width:100%;
            line-height: 30px;
        }
        .inrr h4{
            width:100%;
            line-height: 30px;
        }
        .inrr input{
            width:70%;
            height:30px;
        }
        .inrr h4 span{
            line-height: 30px;
        }
        td{
            text-align: left !important;
            vertical-align: middle;
        }
        .buy{
            border-top: 1px solid #ececec;
        }
    </style>
</head>
<body>
<div class="mui-card mui-input-row mui-checkbox mui-left li_f mui-clearfix" style="margin: 0; margin-top: 10px;border-radius: 0px;padding-top:10px;">
    <div class="inr" style="margin-left: 15px;">
        <h3 style="padding-left:16px;">
            <img src="${webRoot}/images/about.jpg"
                 style="max-width: 5px; margin-right: 10px; vertical-align: bottom;">订单详情
            <div class="a-choose" onclick="chooseInvoice()">
                &nbsp;
            </div>
        </h3>
        <div class="inrr" style="width:100%;margin-left:15px;">
            <h4>
                <span>订单编号</span>${note.procurementNo}&nbsp;
            </h4>
            <h4>
                <span>创建时间</span><fmt:formatDate value="${note.createDate}" pattern="yyyy-MM-dd HH:mm"/>&nbsp;
            </h4>
        </div>
        <div class="inxp inn">
            <table class="buy">
                <thead>
                <tr class="buyr">
                    <td width="60%">产品名称</td>
                    <td width="10%" class="zb">数量</td>
                    <td width="30%" style="text-align: left;">金额</td>
                </tr>
                </thead>

                <tbody id="buyTable">
                <c:set var="totalPrice" value="0"/>
                <c:set var="totalCount" value="0"/>
                    <c:forEach var="part" items="${note.partList}" >
                        <tr>
                            <td><input type="hidden" name="selProId" value="{$T.}">${part.partInfo.wechatName}</td>
                            <td class="zb">${part.num}</td>
                            <c:set var="totalCount" value="${totalCount+part.num}"/>
                            <td class="sk_tt price-group">
                                    <span style="line-height: 1em">¥<fmt:formatNumber type="number" pattern="#,##0.00" value="${part.price}"></fmt:formatNumber></span><br/>
                                    <span style="line-height: 1em">¥<fmt:formatNumber type="number" pattern="#,##0.00" value="${part.partInfo.terminalPrice}"></fmt:formatNumber></span>
                                <c:set var="totalPrice" value="${part.price+totalPrice}"/>
                            </td>
                        </tr>
                    </c:forEach>
                </tbody>

                <tfoot>
                <tr class="zj">
                    <td>合计</td>
                    <td class="zb">${totalCount}</td>
                    <td class="sk_tt" style="color:red">¥<fmt:formatNumber type="number" pattern="#,##0.00" value="${totalPrice}"/></td>
                </tr>
                </tfoot>

            </table>
        </div>
    </div>
</div>


<div class="mui-card mui-input-row mui-checkbox mui-left li_f mui-clearfix" style="margin: 0; margin-top: 10px;border-radius: 0px;padding-top:10px;">
    <div class="inr" style="margin-left: 0px;">

        <div class="inrr" style="padding-bottom: 10px;width:100%">
            <h4 style="margin:0;">
                <span>设备序列号</span>${note.snNo}&nbsp;
            </h4>
        </div>
    </div>
</div>

<div class="mui-card"
     style="margin: 0; box-shadow: none; background: none;">
    <ul class="mui-table-view hn">
        <li>
            <div class="mui-input-row mui-checkbox mui-left li_f mui-clearfix">
                <div class="inr" >
                    <h3 style="padding-left: 16px;">
                        <img src="${webRoot}/images/about.jpg"
                             style="max-width: 5px; margin-right: 10px; vertical-align: bottom;">收货人信息
                    </h3>
                    <div class="inrr" style="width:100%">
                        <h4>
                            <span>联系人</span>${note.contactName}&nbsp;
                        </h4>
                        <h4>
                            <span>邮箱</span>${note.contactMail}&nbsp;
                        </h4>
                        <h4>
                            <span>电话</span>${note.contactPhone}&nbsp;
                        </h4>
                        <h4>
                            <span>所属影院</span>${note.cinemaName}&nbsp;
                        </h4>
                    </div>
                </div>
            </div>
        </li>
    </ul>
</div>

<div class="mui-card mui-input-row mui-checkbox mui-left li_f mui-clearfix" style="margin: 0; margin-top: 10px;border-radius: 0px;padding-top:10px;">
    <div class="inr" >
        <h3 style="padding-left: 15px;">
            <img src="${webRoot}/images/about.jpg"
                 style="max-width: 5px; margin-right: 10px; vertical-align: bottom;">服务协议
        </h3>
        <div class="inrr" style="padding: 5px 10px;">
            在本协议执行过程中，如果出现了不可抗力事件，并在事实上影响本协议的正确履行时，受不可抗力情况影响的一方应尽快将情况通知对方，并尽快证明文件提交对方确认。
        </div>
    </div>
</div>
<div class="mui-card mui-input-row mui-checkbox mui-left li_f mui-clearfix" style="margin: 10px 0 20px 0px;border-radius: 0px;padding-top:10px;">
    <div class="inr" >
        <div class="inrr" style="width:100%;margin-left:15px;">
            <h4>
                <span>上门服务</span><t:dictSelect field="onService" defaultVal="${note.isOnsiteServices}" typeGroupCode="trueOfFlaseNum" type="span"/>&nbsp;
            </h4>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(function(){
        $(".note-state-color").each(function(){
            var o = $(this);
            var color = "red";
            switch (o.attr("data-state")){
                case "2":
                    color = "#30c07b";
                    break;
                case "1":
                    color = "#0286c6";
                    break;
                case "0":
                    color = "#e30015";
                    break;
            }
            o.css("color",color);
        })
    })
</script>
</body>
</html>